<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>QQ邮箱注册</title>
</head>
<body>
<h2>QQ邮箱注册</h2>
<form id="registrationForm" action="{% url 'user:register' %}" method="post">
    {% csrf_token %}
    <div>
        <label for="email">邮箱地址:</label>
        <input type="email" id="email" name="email" required>
    </div>
    <div>
        <label for="password">密码:</label>
        <input type="password" id="password" name="password" required>
    </div>
    <div>
        <label for="confirm_password">确认密码:</label>
        <input type="password" id="confirm_password" name="confirm_password" required>
    </div>
    <div>
        <label for="captcha">验证码:</label>
        <input type="text" id="captcha" name="captcha" required>
        <button type="button" id="sendCaptchaBtn">发送验证码</button>
    </div>
    <div>
        <button type="submit">注册</button>
    </div>
</form>
<script>
    document.getElementById('sendCaptchaBtn').addEventListener('click', function(event) {
        event.preventDefault(); // 阻止按钮默认行为
        var email = document.getElementById('email').value;
        if (email) {
            // 发送请求到发送验证码的视图
            fetch('/send_captcha/?email=' + email, {
                method: 'GET',
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('验证码已发送到您的邮箱，请注意查收。');
                } else {
                    alert('发送验证码失败，请稍后再试。');
                }
            })
            .catch(error => {
                console.error('Error:', error);
            });
        } else {
            alert('请输入您的邮箱地址。');
        }
    });


</script>
</body>
</html>
